<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2018/11/7
  Time: 10:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
    <title>入库统计</title>
    <link href="${pageContext.request.contextPath}/statics/hplus/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/statics/hplus/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath}/statics/hplus/js/jquery.min.js"></script>
    <script src="${pageContext.request.contextPath}/statics/hplus/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/statics/hplus/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="${pageContext.request.contextPath}/statics/hplus/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script>


        function searcha() {
            //返回表格的 Options。
            var opts = $("#roletb").bootstrapTable("getOptions") ;
            var limit = opts.pageSize ;
            var offset = (opts.pageNumber-1) * limit;
            var username = $("#username").val() ;
            $.post("${pageContext.request.contextPath}/RuKuTongJi/queryByName",{'id':username,'limit':limit,'offset':offset},function (data) {
                // var mydata = eval("("+data+")") ;
                //重新绑定表格数据
                $("#roletb").bootstrapTable('load',data) ;
            })
        }


        $(function () {
            $("#roletb").bootstrapTable({
                url:'${pageContext.request.contextPath}/RuKuTongJi/queryByName',
                //设置每页多少条数据
                pageSize:2,
                pageList:[2,4,8,16],
                height:300,
                pageNumber:1,
                //启用分页，但是默认情况下，是客户端分页的
                pagination:true,
                //启用服务器端分页
                sidePagination:'server',
                queryParams:function(params){
                    var temp = {  //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                        limit: params.limit,  //页面大小
                        offset: params.offset, //页码
                        id:$("#username").val()
                    };
                    return temp;
                },
                columns:[
                    {
                        field:'rukushijian',
                        title:'入库时间'
                    },
                    {
                        field:'dianpu_name',
                        title:'店铺'
                    },
                    {
                        field:'leixing_name',

                        title:'操作类型'
                    },
                    {
                        field:'kucunshul',
                        title:'入库数量'
                    },
                    {
                        field:'kucunChengben',
                        title:'应付金额'
                    },
                    {
                        field:'kucunChengben',
                        title:'实付金额'
                    },
                    {
                        field:'banliren',
                        title:'经办员工'
                    },
                    {
                        field:'kucunId_Danjuhao',
                        title:'单号'
                    },
                    {
                        field:'Shangpin_id',
                        title:'操作',
                        formatter:function () {
                            return "<button class='btn brn-primary' onclick='shop(shopid)'>查询单据</button>"
                        }
                    }
                ]
            }) ;
        }) ;
        var shopId=0
        function shop(shopid) {
                shopId=shopid;
        }


        function toadd() {
            $("#modelId").modal("show") ;
        }

       // $('#profile').load('RuKuMX.jsp');  //content_left为div的id名




    </script>

</head>
<body>


<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">入库统计</h3>
    </div>

<%--&lt;%&ndash;tab切换&ndash;%&gt;--%>
    <%--<ul class="nav nav-tabs" id="myTab" role="tablist">--%>
        <%--<li class="nav-item">--%>
            <%--<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>--%>
        <%--</li>--%>
        <%--<li class="nav-item">--%>
            <%--<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>--%>
        <%--</li>--%>
    <%--</ul>--%>
    <%--<div class="tab-content" id="myTabContent">--%>
        <%--<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab"></div>--%>
        <%--<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab"><iframe src="RuKuMX.jsp" width="100%" height="100%" frameborder="1" marginwidth="0" marginheight="0" scrolling="no"></iframe></div>--%>
    <%--</div>--%>
<%--&lt;%&ndash;tab切换底部&ndash;%&gt;--%>




    <div class="panel-body">
        <div class="row">
                <div class="col-sm-6">
                </div>
            <div class="col-sm-6">
                <form  class="form-inline pull-right">
                    <input id="username" type="text" class="form-control">
                    <button class="btn btn-primary" onclick="searcha()" type="button"><span class="glyphicon glyphicon-search"></span>&nbsp;&nbsp;搜索</button>
                </form>
            </div>
        </div>
        <c:forEach items="queryRuKu" var="h">
        <table class="table">
            <thead>
            <tr>
                <th scope="col">汇总:</th>
                <th scope="col">数量:</th>
                <th scope="col">金额:</th>
            </tr>
            </thead>
        </table>
        </c:forEach>
        <div class="row">
            <div class="col-sm-12">
                <table id="roletb"></table>
                <p style="font-size: 20px">汇总:<span id="count">数量:${count}</span>&nbsp;&nbsp;<span id="price">价格:${price}</span></p>
            </div>
        </div>
    </div>
</div>

<!--增加模态框-->
<div class="modal fade" id="modelId">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="modelTitleId">提示</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
            </div>
        </div>
    </div>
</div>
</body>
</html>